<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!-- 让预加载器知道这些动态请求文件的存在. -->
  <link rel="preload" href="gibberish.js">
  <title>Document</title>
  <!-- defer推迟脚本的执行,立即下载,但等到页面完全解析完毕后再执行,建议只包含一个这样的文件 -->
  <script defer src=""></script>
  <!-- async属性无法保证能按照它们的出现顺序执行,它们之间木有依赖关系 -->
  <script async src="e1.js"></script>
  <script async src="e2.js"></script>
</head>
<!-- 浏览器遇到<body>开始渲染页面 -->

<body>
  <script>
    function sayScript() {
      console.log("<\/script>")
    }
    sayScript()

    // 动态加载脚本,对浏览器预加载器是不可见的.
    let script = document.createElement("script")
    script.src = "gibberish.js"
    // 动态创建的<script>元素默认是以异步加载的,通过script.async = false设置为同步加载.
    script.async = false
    document.head.appendChild(script)
  </script>

  <!-- 处理XHTML,把代码放在一个CDATA块中,其内容不作为标签来解析,不会引发语法错误. -->
  <!-- 黑科技用法,对于不支持CDATA块的非XHTML兼容浏览器,CDATA块用JavaScript注释来抵消. -->
  <script type="text/javascript">
    //< ![CDATA[
    function compare(a, b) {
      if (a < b) {
        console.log("a is less than b")
      } else if (a > b) {
        console.log("a is greater than b")
      } else {
        console.log("a is equal to b")
      }
    }
     //]] >
  </script>

  <!-- 对于不支持JS的浏览器,把JS代码放在HTML注释中.已经废弃,而且不推荐使用. -->
  <!-- <script><!--
  function sayHi(){
    console.log("Hi!")
  }
  //--> </script> -->
  <script src="" integrity="" type="" charset="" crossorigin=""></script>

  <noscript>
    <!-- 浏览器不支持JS或支持被关闭,就会出现这段话 -->
    <p>This page requires a javascript-enabled browser.</p>
  </noscript>
</body>

</html>